<div class="field-wrapper">
    <label class="label" nz-tooltip *ngIf="!componentData.extends?.noLabelTxt"
        [nzTooltipTitle]="(componentData && componentData.labelText) ? componentData.labelText : '地址选择'">
        {{(componentData && componentData.labelText) ? componentData.labelText : '地址选择'}}
    </label>
    <ng-container *ngIf="!componentData.disabled;else disabledTpl">
        <div class="field-control" [zeprideAuthority]="zeprideAuthorityData"
            [ngClass]="{'has-form-error': getComponentError(componentData.identifyId)}">
            <!-- <nz-cascader class="border-form-item cascader" [nzOptions]="nzOptions" [nzLabelProperty]="'name'"
                [nzValueProperty]="'name'" [nzShowSearch]="true" [ngModel]="dataMode"
                (nzSelectionChange)="setBindData($event)">
            </nz-cascader> -->
            <div class="ad-panel">
                <nz-select class="ad-panel-item" [(ngModel)]="curProvince" nzPlaceHolder="省"
                    (ngModelChange)="provinceChange()" [disabled]="componentData.readonly">
                    <nz-option [nzValue]="item" [nzLabel]="item.name" *ngFor="let item of provinceList"></nz-option>
                </nz-select>
                <nz-select class="ad-panel-item" [(ngModel)]="curCity" nzPlaceHolder="市" (ngModelChange)="cityChange()" [disabled]="componentData.readonly">
                    <nz-option [nzValue]="item" [nzLabel]="item.name" *ngFor="let item of cityList"></nz-option>
                </nz-select>
                <nz-select class="ad-panel-item" [(ngModel)]="curArea" nzPlaceHolder="区"
                    (ngModelChange)="setBindData($event)" [disabled]="componentData.readonly">
                    <nz-option [nzValue]="item" [nzLabel]="item.name" *ngFor="let item of areaList"></nz-option>
                </nz-select>
            </div>
        </div>
        <span class="error-tip" *ngIf="getComponentError(componentData.identifyId)">
            <ng-container *ngTemplateOutlet="errorTpl"></ng-container>
        </span>
    </ng-container>
</div>

<ng-template #errorTpl>{{getErrorMsg(componentData.identifyId)}}</ng-template>

<ng-template #disabledTpl>
    <span class="field-control">{{readonlyValue}}
        <i *ngIf="dataChangeLog" class="iconfont icon-file-list-2-line icon-data-change" nz-popover
            [nzPopoverContent]="contentTemplate"></i>
    </span>
</ng-template>

<ng-template #contentTemplate>
    <div class="popover-content">
        <div>近期更正</div>
        <div>更正时间：{{dataChangeLog.time | date: 'yyyy年MM月dd日 HH:mm'}}</div>
        <div>更正内容：由“<span class="font-red">{{dataChangeLog.sourceValue}}</span>”更正为“<span
                class="font-bule">{{dataChangeLog.targetValue}}</span>”
        </div>
    </div>
</ng-template>